import React, {Component} from 'react';
import http from '../http';
import '../assets/css/login.scss';

class Login extends Component {
	constructor(props) {
		super(props);
		this.state = {
			username: '',
			password: ''
		}
	}

	componentDidMount() {
		if (this.props.location.state === 'closeLogin') {
			this.props.closeLogin();
		}
	}

	adminLogin = async (e) => {
		e.preventDefault();
		let data = await http.adminLogin({
			username: this.state.username,
			password: this.state.password
		})
		if (data.status === 1) {
			alert(data.msg)
		} else if (data.status === 0) {
			localStorage.setItem('mmallUser', JSON.stringify(data.data));
			this.props.change(data.data);
			this.props.history.push('/');
		}
	}

	changeUserName = (e) => {
		this.setState({
			username: e.target.value
		})
	}

	changePassWord = (e) => {
		this.setState({
			password: e.target.value
		})
	}

	render() {
		return (
			<div id="login">
				<form className="login-container">
					<div>欢迎登录 - MMALL管理系统</div>
					<div>
						<input className="form-control" type="text" placeholder="User Name" value={this.state.username}
						       onChange={this.changeUserName}/>
					</div>
					<div>
						<input className="form-control" type="password" placeholder="Password"
						       value={this.state.password}
						       onChange={this.changePassWord}/>
					</div>
					<div>
						<button className="btn btn-primary" onClick={this.adminLogin}>登录</button>
					</div>
				</form>
			</div>
		);
	}
}

export default Login;